<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    // webStorage    网页存储(H5新增)

    // ## 什么是WebStorage?
    // WebStorage的目的是克服由cookie所带来的一些限制，当数据需要被严格控制在客户端时，不需要持续的将数据发回服务器。

    // ## WebStorage两个主要目标：
    // 1.提供一种在cookie之外存储会话数据的路径  (一种新的在用户本地 存储数据的方式)
    // 2.提供一种存储大量可以跨会话存在的数据的机制  (webStorage也可以跨页面访问 )
    // HTML5的WebStorage提供了两种API：localStorage（本地存储）和sessionStorage（会话存储）

    // 对比cookie => 将数据严格控制在客户端, 存储大小5M
    // HTML5的WebStorage提供了两种API：localStorage（本地存储）和sessionStorage（会话存储）

    // 如何查看WebStorage (localStorage（本地存储）和sessionStorage（会话存储）)
    // 1. 手动查看   (测试)
    //  开发者工具(控制台)   =>   application(引用)   => localStorage（本地存储）和sessionStorage（会话存储）

    // 2. JS查找  (localStorage（本地存储）和sessionStorage（会话存储）  => 本质全局对象)
    console.log(localStorage);
    console.log(sessionStorage);


    // WebStorage相关的属性和方法

</script>

</html>